<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>仿遨游导航</title>

<style>
	*{
		padding:0; margin:0; font-size:12px; line-height:22px;
	}
	.nav{
		width:960px; background:#8ec25d; height:50px;
		margin:0 auto;
		font-family:Tahoma,'宋体';
	}
	.nav .logo{
		width:200px;
		height:50px;
		float:left; display:inline;
		display:block;
		line-height:50px;
		text-align:center;
	}
	.nav li{ 
		float:left; 
		display:inline; 
		position:relative;
		width:95px;
	}
	.nav li h2 a{
		height:50px;
		text-align:center;
		background:#2b9b22;
		display:block;
		padding:0 15px;
		line-height:50px;
		/*border-right:#85c846 solid 1px;*/
		margin-right:1px;
		color:#fff;
		text-decoration:none;
		font-weight:normal;
		font-size:12px;
	}
	.nav li dl{
		position:absolute;
		left:0;
		top:50px;
		width:153px;
		background:#2b9b22;
		display:none;
	}
	.nav li.selected dl{ display:block;}
	.nav li dl dd a{
		border-bottom:#85c846 solid 1px;
		display:block;
		height:30px;
		line-height:30px;
		padding:0 0 0 15px;
		color:#fff;
		text-decoration:none;
	}
	.nav li dl dd a:hover{
		background:#1b8e11;
	}
</style>
</head>

<body>

<br/>
<br/>
<br/><br/>
<br/>
<div class="nav">
	<a class="logo" href="#">LOGO</a>
    <ul>
    	<li>
        	<h2><a href="#">一级菜单</a></h2>
        </li>
    	<li class="selected">
        	<h2><a href="#">一级菜单</a></h2>
            <dl>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            </dl>
        </li>
    	<li>
        	<h2><a href="#">一级菜单</a></h2>
            <dl>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            </dl>
        </li>
    	<li>
        	<h2><a href="#">一级菜单</a></h2>
            <dl>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            </dl>
        </li>
    	<li>
        	<h2><a href="#">一级菜单</a></h2>
            <dl>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            	<dd><a href="#">二级导航</a></dd>
            </dl>
        </li>
    </ul>
</div>


</body>
</html>
